//原生事件：当页面元素（节点）初始化完成时，必然触发一次的事件
$(function (){
    let id = getId('id');
    if(id > 0){
        axios.get(`http://localhost:3000/fruit/${id}`).then(res => {
            let fruitData = res.data;//注意，此时拿到的fruitData，里面还有一个data对象，数据是在这里面的
            $('[name=fruitName]').val(fruitData.data.fruitName);
            $('[name=price]').val(fruitData.data.price);
        })
    }
})

//新增数据&修改数据
/*
新增：
 1.获取表单数据，向后端api发送请求，携带上表单数据
 2.api拿表单数据，做一些逻辑处理，插入到数据库表，返回插入成功的消息（PS：也可能成功，那就返回不成功的消息）
 3.获取后端返回的响应，判断后做一些反应和处理(插入成功，就给前端表格加一行，否则展示不成功的消息)

修改：
 1.在id存在的前提下，拿到url的id值
 2.使用获取到的id值，向api发送请求，得到id对应的数据，再通过响应返回给前端
 3.前端拿到响应数据，渲染填充页面
*/

function save(){
    //获取表单数据
    let fruitName = $('[name=fruitName]').val();
    let price = $('[name=price]').val();
    //设置输入框不能为空
    if( fruitName.trim() === '' || price.trim() === ''){
        alert('名字或价格不能为空');
        event.preventDefault();
    }
    else{
        //组合表单数据，传过去一个对象
        let obj = {fruitName,price};
        //获取url中的id值
        let id = getId('id');
        //如果id存在且id>0，就进行修改操作
        if(id > 0){
            axios.put(`http://localhost:3000/fruit/${id}`,obj).then(res => {
                let fruitData = res.data;
                if(fruitData.code === 1000){
                    location.href = './index.html';
                }
                else{
                    alert(fruitData.msg);
                }
        })
        }    
        //否则就进行新增操作
        else{
            axios.post('http://localhost:3000/fruit',obj).then(res => {
            let fruitData = res.data;
            //添加成功就跳转到首页
            if(fruitData.code === 1000){
                location.href='./index.html';
            }
            else{
                alert(fruitData.msg);
            }
           })
        }
    }
}
function Cancel() {
    location.href = './index.html';
}


//获取url中的参数值方法如下
//方法一：使用 Web API 中的 URLSearchParams 对象来从当前 URL 中获取指定参数的值
function getId(){
    // 创建一个 URLSearchParams 对象，用于处理 URL 查询参数
    const urlParams = new URLSearchParams(window.location.search);
    // 使用 get 方法从 URL 查询参数中获取名为 'id' 的参数值
    const paramValue = urlParams.get('id');
    return paramValue;
}
//调用测试
// console.log(getId('属性名'));
